<template>
	<div>
		<div style="margin-top: 5%;">
			<div v-for="(item, index) in reply_materials" :key="index" style="width: 95%;margin: auto;">
				<!-- 判断是图片 -->
				<img v-if="item.replyUrl.endsWith('jpg')" :src="item.replyUrl"
					style="width: 100%;" />
				<img v-if="item.replyUrl.endsWith('png')" :src="item.replyUrl"
					style="width: 100%;" />
				<div v-if="item.replyUrl.includes('mp4')">
					<video :src="item.replyUrl" style="width: 100%;"></video>
				</div>
				<div v-if="!item.replyUrl.includes('jpg') && !item.replyUrl.includes('png') && !item.replyUrl.includes('mp4')"
					style="display: flex;" @click="openFile(item.replyUrl)">
					<img src="https://czsc.oss-cn-beijing.aliyuncs.com/qdimgs/files.png"
						style="width: 30px;height: 30px" />
					<p style="margin-top: 1.5%;">{{ item.replyName }}</p>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				reply_id: '',
				reply_materials: []
			}
		},
		onLoad: function(option) {
			this.reply_id = option.reply_id;
			uni.request({
				method: 'POST',
				url: 'https://www.gjegm.ltd/czsczq/replyMaterialUrl/getMaterialByRepId',
				data: {
					reply_id: this.reply_id
				},
				header: {
					'content-type': 'application/x-www-form-urlencoded',
					'token': uni.getStorageSync('token')
				},
				success: (res) => {
					this.reply_materials = res.data.obj
				}
			});
		},
		created() {

		},
		methods: {

		}
	}
</script>

<style>
</style>
